<template>
  <div class="prepare">
      <div class="p-icon">
        <p class="el-icon-success"></p>
      </div>
      <div class="p-txt">
          <p>系统准备中</p>
      </div>
      <div class="p-skip">
          <a href="#">页面跳转·</a> 
          <i>加载时间： {{num}}</i>
        </div>
  </div>
</template>

<script>

export default {
  data() {
      return {
          num:3
      }
  },
  mounted(){
      var timer = setInterval(()=>{
          this.num--
      if(this.num == 0){
          clearInterval(timer)
      }
      },1000)
      
  }
}
</script>
<style lang="less" scoped>
*{
    margin: 0;
    padding: 0;
}
i,
em {
  font-style: normal;
}
a{
    text-decoration: none;
}
.prepare{
    margin-top: 200px;
    .p-icon,.p-txt,.p-skip{
    display: flex;
    justify-content: center;
    align-items: center;
    }
    .p-icon{
        p{
            font-size: 160px;
            color: #15c377;
        }
    }
    .p-txt{
        padding: 90px;
        p{
            font-size: 20px;
            font-weight: 600;
        }
    }
    .p-skip{
            font-size: 16px;
        a{
            font-size: 16px;
            color: #a7b1c5;
            font-weight: 600;
        }
        i{
            font-size: 16px;
            font-weight: 600;
            padding: 0 5px;
        }
    }
}
</style>